<template>
  <div class="app-coupon">
    <van-nav-bar
    title="优惠券列表"
    left-arrow
    @click-left="$router.go(-1)"
    />
    <van-tabs v-model="active">
      <van-tab title="未使用">
        <div class="empty">
          <van-empty description="您没有未使用的优惠券" />
        </div>
      </van-tab>
      <van-tab title="已使用/已过期">
        <div class="timeout">
          <van-empty description="您没有已使用/已过期的优惠券" />
        </div>
      </van-tab>
    </van-tabs>
  </div>
</template>
<script>
import Vue from 'vue'
import { Tab, Tabs, Empty } from 'vant'

Vue.use(Tab)
Vue.use(Tabs)
Vue.use(Empty)
export default {
  name: 'AppCoupon',
  data () {
    return {
      active: 1
    }
  },
  computed: {

  }
}
</script>
<style lang="scss" scoped>
.app-coupon {
  background: rgb(245, 245, 245);
  .empty {
    height: 530px;
    img {
      margin-bottom: .1rem;
      width: 1.3rem;
    }
  }
  .timeout {
    height: 5.3rem;
  }
}
</style>
